import { Col, Row, Statistic } from "antd";

const StatisticCard = () => {
  const list = [
    { label: "当日可用余额", value: 112893 },
    { label: "当日收入", value: 112893 },
    { label: "计划还未付款", value: 112893 },
    { label: "冻结资金", value: 112893 },
    { label: "累计余额", value: 112893 },
    { label: "保证金余额", value: 112893 },
    { label: "销售监管资金", value: 112893 },
    { label: "销售监管资金可用余额", value: 112893 },
  ];
  return (
    <>
      <Row gutter={24}>
        {list.slice(0, 4).map(item => {
          return (
            <Col span={6} key={item.label}>
              <Statistic title={item.label} value={item.value} className="flex flex-col items-center w-full" />
            </Col>
          );
        })}
      </Row>
      <Row gutter={24} className="mt-16">
        {list.slice(-4).map(item => {
          return (
            <Col span={6} key={item.label}>
              <Statistic title={item.label} value={item.value} className="flex flex-col items-center w-full" />
            </Col>
          );
        })}
      </Row>
    </>
  );
};

export default StatisticCard;
